import React, { useRef } from 'react'
import store from "../../redux/store"; 
import { createAdd, createSub } from '../../redux/dispatch' 

export default function Home() { 
  let addref = useRef() 
  const add = () => { 
    let val = addref.current.value
    store.dispatch(createAdd(val * 1))
  }
  const sub = () => { 
    let val = addref.current.value
    store.dispatch(createSub(val * 1))
  }
  const asycAdd = () => { 
    let val = addref.current.value
    setTimeout(() => {
      store.dispatch(createAdd(val * 1))
    }, 500);
  }
  return (
    <div>
      <hr />
      <h1>当前值：{store.getState()} </h1>
      <select ref={addref}>
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
      </select> &nbsp;
      <button onClick={add}> ++1 </button> &nbsp;
      <button onClick={sub}> -1 </button> &nbsp;
      <button onClick={asycAdd}> 异步加1 </button> &nbsp;
      <h1>Home</h1>
      <hr />
    </div>
  )
} 
